// import React from 'react'

 
import { useLocation } from "react-router-dom"

import {
    DashboardOutlined, 
    UserOutlined, TagOutlined
} from '@ant-design/icons';
import { FloatButton } from "antd";
function Index() {
    const loca = useLocation()
    const detail = loca.state 
    return (
        <div style={{ background: '#fcf1f0', minHeight: '100vh', minWidth: '100vw' }}>
            <h1 style={{ fontSize: '40px', fontWeight: 'bold' }}>{detail.title}</h1>
            <p><UserOutlined />{detail.content}&emsp;<DashboardOutlined />{detail.updatedAt}&emsp;<TagOutlined />{detail.viewCount}</p>
            <p style={{ padding: '20px', fontSize: '25px' }}>{detail.content}</p>
            <FloatButton.Group shape="circle" style={{ insetInlineEnd: 24 }}>
                <FloatButton.BackTop visibilityHeight={0} />
            </FloatButton.Group>
        </div>
    )
}

export default Index
